#left {
  display: grid;
  grid-auto-columns: 100%;
  grid-template-columns: calc(100%);
  grid-template-rows: 50% 50%;
  height: 100%;
  margin: 0 14px 0 0;
  
  .border-title{
    font-family: PingFangSC-Semibold;
    font-size: 14px;
    color: #BED7FA;
    letter-spacing: 0;
    position: absolute;
    left: 0.2rem;
    top: 0.5rem;
  }

  .border-number{
    font-family: Digital-7Mono;
    font-size: 34px;
    color: #FFFFFF;
    letter-spacing: 1.21px;
    position: absolute;
    top: 4rem;
    left: 7.2rem;
  }

  .border-unit{
    font-family: PingFangSC-Regular;
    font-size: 12px;
    color: #BED7FA;
    letter-spacing: 0.43px;
    position: absolute;
    left: 15.5rem;
    top: 3.5rem;
  }

  .border-tb{
    font-family: PingFangSC-Regular;
    font-size: 14px;
    letter-spacing: 0.3px;
    position: absolute;
    left: 8.2rem;
    top: 7rem;
    float: right;
  }

  .border-x-style{
    height: 5.5rem;
    width: 13rem;
    border-left: 1px solid rgba(255,255,255,0.20);
    border-right: 1px solid rgba(255,255,255,0.20);
    margin: 3.8rem 2.4rem;
  }

  .border-y-style{
    height: 4.8rem;
    width: 13.8rem;
    border-top: 1px solid rgba(255,255,255,0.20);
    border-bottom: 1px solid rgba(255,255,255,0.20);
    margin-left: -0.5rem;
    position: relative;
    top: 0.3rem;
  }

  .title-enterprises{
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #BED7FA;
    letter-spacing: 0;
    position: relative;
    top: -2.2rem;
  }

  .number-enterprises{
    font-family: DINAlternate-Bold;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0;
    position: absolute;
    top: 2.5rem;
    left: 5rem;
  }

  .text-enterprises{
    font-family: PingFangSC-Regular;
    font-size: 12px;
    color: #FFFFFF;
    letter-spacing: 0;
    position: relative;
    left: 1rem;
  }

  .div-progress1{
    opacity: 0.2;
    background: #FFFFFF;
    border-radius: 3px;
    width: 13.8rem;
    height: 0.46rem;
    position: relative;
    left: 5.3rem;
    top: -1.5rem;
  }

  .div-progress2{
    background-image: linear-gradient(270deg, #FFFFFF 0%, rgba(43,183,255,0.80) 100%);
    border-radius: 3px;
    height: 0.46rem;
    position: relative;
    left: 5.3rem;
    top: -2rem;
  }

  .title-progress{
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #BED7FA;
    letter-spacing: 0;
    text-align: right;
    line-height: 32px;
  }

  .number-progress{
    font-family: Digital-7Mono;
    font-size: 16px;
    color: #FFFFFF;
    letter-spacing: 1px;
    text-align: right;
    line-height: 32px;
    position: relative;
    left: 21.5rem;
    top: -3.5rem;
    width: 3.5rem;
  }

  .text-progress{
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #BED7FA;
    letter-spacing: 0.88px;
    line-height: 32px;
    position: relative;
    left: 26rem;
    top: -6rem;
  }

  .bg-style{
    background-image: url('../../assets/left/border_sjk.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 12.6rem;
    height: 5.5rem;
    float: left;
    margin-right: 3rem;
  }
  .number-person{
    font-family: DINAlternate-Bold;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0.86px;
    position: relative;
    top: 1.5rem;
  }

  .text-person{
    font-family: PingFangSC-Semibold;
    font-size: 14px;
    color: #BED7FA;
    letter-spacing: 0;
    white-space: nowrap;
    position: relative;
    top: 2rem;
  }

  .div-bottom{
    float: left;
    width: 22rem;
    height: 13.85rem;
    position: relative;
    top: -5.16rem;
  }

  .title-bottom{
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #2BB7FF;
    letter-spacing: 0;
    margin-top: 2rem;
  }

  .number-bottom{
    font-family: DINAlternate-Bold;
    font-size: 20px;
    color: #FFFFFF;
    letter-spacing: 0;
    margin-top: 1rem;
    float: left;
  }

  .text-bottom{
    font-family: PingFangSC-Regular;
    font-size: 12px;
    color: #FFFFFF;
    letter-spacing: 0;
    float: left;
    margin-top: 1.1rem;
    margin-left: 0.5rem;
  }

  // 第三个模块
  .thirdItemContent {
      width:100%;
      height:70%;
      // 柱状基本样式
      .color-div-base {
          width: 1.5rem;
          height: 15rem;
          position: absolute;
          bottom: 0;
          border-top-right-radius: 1rem;
          border-top-left-radius: 1rem;
        
        }
        // 蓝色柱状
        .blue-div {
          position: absolute;
          bottom:1rem;
          left: 14rem;
          background-image: linear-gradient(
              180deg,
              #2bb7ff 30%,
              rgba(43, 183, 255, 0) 100%
            );
        }
        // 红色柱状
        .red-div {
          position: absolute;
          bottom:1rem;
          left: 17.5rem;
          background-image: linear-gradient(
              180deg,
              #D94F64 30%,
              rgba(217, 79, 100, 0) 100%
            );
        }
        // 黄色柱状
        .yellow-div {
          position: absolute;
          bottom:1rem;
          left: 14rem;
          height: 11rem;
          background-image: linear-gradient(
              180deg,
              #FCB33A 30%,
              rgba(252, 179, 58, 0) 100%
            );
      }
      // 绿色柱状
      .green-div {
          position: absolute;
          bottom:1rem;
          left: 17.5rem;
          height: 11rem;
          background-image: linear-gradient(
              180deg,
              #60BFB9 30%,
              rgba(96, 191, 185, 0) 100%
            );
      }
  }
}
